<template>
  <div class="xtx-home-page">
    <div class="container">
      <!-- 左侧分类 -->
      <HomeCate />
      <!-- 轮播图 -->
      <HomeBanner />
      <!-- 新鲜好物 -->
      <HomeNew />
      <!-- 人气推荐 -->
      <HomeHot />
      <!-- 热门品牌 -->
      <HomeBrand />
    </div>
    <!-- 测试Pannel面板组件 -->
    <!-- <HomePannel title='主标题' subTitle='副标题'>
      <template #right>
        <XtxMore path='/' />
      </template>
      如果template标签上没有指定插槽名称，默认template标签不会渲染出来，或者不要template标签直接使用原生标签
      <template v-slot:default>
        <div>内容区</div>
      </template>
    </HomePannel> -->
  </div>
</template>

<script>
import HomeCate from './components/home-cate.vue'
import HomeBanner from './components/home-banner.vue'
import HomeNew from './components/home-new.vue'
import HomeHot from './components/home-hot.vue'
import HomeBrand from './components/home-brand.vue'
export default {
  name: 'home',
  components: {
    HomeCate,
    HomeBanner,
    HomeNew,
    HomeHot,
    HomeBrand
  }
}
</script>

<style scoped lang='less'>
.xtx-home-page {
  .container {
    width: 1240px;
    margin: 0 auto;
    position: relative;
  }
}
</style>
